<script context="module">
	/**
	 * @type {import('@sveltejs/kit').Load}
	 */
	export async function load({ page, fetch, session, context }) {
		const slug = page.params.slug;
		const url = `${slug}.json`;
		return fetch(url)
			.then((r) => r.json())
			.then((article) => {
				return {
					props: {
						article
					}
				};
			});
	}
</script>

<script lang="ts">
	export let article;
</script>

<svelte:head>
	<title>{article.title}</title>
</svelte:head>
{#if article}
	<div class="post-preview">
		<a href="/blog/{article.slug}">
			<h2 class="post-title">{article.title}</h2>
		</a>
		<div class="post-subtitle">{@html article.html}</div>
	</div>
{/if}
